I have tried putting a variable that changes when the slider changes but it didn't work. Does anyone have an idea? The code below is some examples of what I'm trying to do: That is: creating a BPM every second the chord changes, by creating a slider that changes the value of the seconds but it just doesn't work and I don't know how I can do it.
//Example of what i wanna do.
var i = 0;
var inter;
var index = 4;
function change() {
var doc = document.getElementById("First");
var doc2 = document.getElementById("Next1");
const ar = ["A","Am","B","Bm","C","Cm","D","Dm","Em","F","Fm","G","Gm"];//Chords
doc.innerHTML = ar[i];//Showing the first chord
doc2.innerHTML = ar[i+1];//Showing the next chord
i = (i + 1) % ar.length;
}
inter = setInterval(change, 4000);// this is what im having problems with.
//Example of what i tried before this poster:
//Did not worked
function changeVelocity(){
velocity = document.getElementById("VelocitySlider").value;
if(velocity = 40){
inter = setInterval(change, 1.5*1000);
}
}
//What i did in HTML was this.
//The input code im talking about:
<input oninput="changeVelocity();"onchange="changeVelocity();"type="range" min="40" step="5"max="180" value="40" class="slider" id="Vel">
PS: thank you @Asad Gulzar & thank you to @Andy. Turns out it was easier than I tough. I just had to reset the first function (setInterval) by doing
var inter = setInterval(function,1000);
//reset
function changeVelocity(){
velocity = document.getElementById("VelocitySlider").value;
if(velocity == 40){// put 2 "==" not just one
clearInterval(inter); // reset the variable
inter = setInterval(change, 1.5*1000); //adding an new number
}```
on each range change you need to clear the previous setInterval and set new interval